import {ProColumns, ProTable} from "@ant-design/pro-components";
import {CustomerChannelVO, getCustomerChannelPage, removeCustomerChannel} from "@/services/CustomerChannelService";
import {Button, Popconfirm, Space} from "antd";
import React from "react";

export interface CustomerChannelProps {
    onSave?: () => void;
    onUpdate?: (record: CustomerChannelVO) => void;
}


const CustomerChannel = (props: CustomerChannelProps) => {

    /**
    * 列定义
    */
    const columns: ProColumns<CustomerChannelVO>[] = [
        {
            title: "渠道名",
            dataIndex: "channelName",
            hideInSearch: true,
        },
        {title: '操作', render: (_: any, record: CustomerChannelVO) => [
        <Space key="operate">
            <Button type="link" size="small" onClick={() => props.onUpdate && props.onUpdate(record)}>编辑</Button>
            <Popconfirm
                title="确定要删除吗"
                onConfirm={() => {
                    removeCustomerChannel(record.id).then()
                }}
                okText="确认"
                cancelText="取消"
            >
                <Button type="link" danger size="small">删除</Button>
            </Popconfirm>
        </Space>
        ],
        hideInSearch: true,
        }
    ]

    // 工具栏
    let actions = [
        props?.onSave && <Button key="create" type="primary" onClick={props.onSave}>添加</Button>
    ]

    return <>
        <ProTable columns={columns}
              request={getCustomerChannelPage}
              toolbar={{
                actions: actions
              }
              }>
        </ProTable>
    </>
}

export default CustomerChannel
